import {defineStore} from 'pinia';
// import {useStorage} from '@vueuse/core';
import defaultSettings from '@/settings';

export const useSettingsStore = defineStore({
  id: 'setting',
  state: () => ({
    showSettings: defaultSettings.showSettings,
    fixedHeader: useStorage('fixedHeader', defaultSettings.fixedHeader),
    sidebarLogo: useStorage('sidebarLogo', defaultSettings.sidebarLogo),
    sidebarTitle: defaultSettings.title,
    tagsView: useStorage('tagsView', defaultSettings.tagsView),
    layout: useStorage('layout', defaultSettings.layout)
  }),
  actions: {
    changeSetting(param = {}) {
      const { key, value } = param;
      switch (key) {
        case 'showSettings':
          this.showSettings = value;
          break;
        case 'fixedHeader':
          this.fixedHeader = value;
          break;
        case 'tagsView':
          this.tagsView = value;
          break;
        case 'sidevarLogo':
          this.sidebarLogo = value;
          break;
        case 'layout':
          this.layout = value;
          break;
        default:
          break;
      }
    }
  }
});